<script setup lang="ts">
import { navigateTo } from '@tarojs/taro';
import dayjs from 'dayjs';
import { Right as AppNutIconRight } from '@nutui/icons-vue-taro';
const props = defineProps<{
  item: AssetDetail.MaintenanceRecordDto;
  /**
   * @param from: maintenance或inspection
   */
  from: string;
}>();

function jumpToDetail() {
  if (props.from === 'maintenance') {
    navigateTo({
      url: `/pages/maintenance/edit/index?planTaskId=${props.item.planTaskId}&assetId=${props.item.assetId}`,
    });
  } else {
    navigateTo({
      url: `/pages/inspection/edit/index?planTaskId=${props.item.planTaskId}&assetId=${props.item.assetId}`,
    });
  }
}
</script>
<template>
  <view class="device-list-item" @click="jumpToDetail()">
    <view class="device-list-item__left">
      <view class="device-list-item__left--top">{{
        dayjs(Number(props.item.handleTime)).format('YYYY年MM月DD日') || '--年--月--日'
      }}</view>
      <view class="device-list-item__left--bottom"
        ><text>操作人:&nbsp;&nbsp;</text><text>{{ props.item.handleUserName || '_' }}</text></view
      >
    </view>
    <view class="device-list-item__right">
      <app-nut-icon-right />
    </view>
  </view>
</template>
<style lang="scss">
.device-list-item {
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 20px;
  padding: 15px 20px;
  font-size: 24px;
  color: #555;
  overflow: hidden;
  display: flex;
  align-items: center;

  &__left {
    color: #999;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 5px;
    flex-direction: row;
    flex: 1;
  }

  &__right {
    display: flex;
    align-items: center;
  }
}
</style>
